<template>
    <div class="login">
      <Log @log = 'isLogin' text='登录' :sw='inputShow'>
          <p class="main-text">
              <router-link :to='{name: "Logon"}' class="router">
              <span >立即注册 </span>
              </router-link>
              &nbsp;|&nbsp;<span> 忘记密码</span></p>
      </Log>
    </div>
</template>

<style lang="scss" scoped>
@import '../../assets/style/public.scss';
.login{
    width: 100%;
    height: 100%;
}
.main-text{
    margin: 0;
    font-size: .14rem;
    color: $log-color;
    .router{
        color: $log-color;
    }
}
</style>

<script>
import Log, { userLoginEffect } from '../../components/log/log.vue'
import { useRouter } from 'vue-router'
export default {
  name: 'Login',
  components: {
    Log
  },
  setup () {
    const inputShow = false
    const router = useRouter()
    const isLogin = userLoginEffect(
      'https://www.fastmock.site/mock/ae8e9031947a302fed5f92425995aa19/jd/api/user/login',
      () => {
        localStorage.isLogin = true
        router.push({ name: 'Home' })
      },
      '登录失败'
    )

    // 使用js跳转页面
    // function toLogon () {
    //   router.push({ name: 'Logon' })
    // }
    return { isLogin, inputShow }
  }
}
</script>
